import Vue from 'vue'
import VueRouter, { RouteConfig } from 'vue-router'
import Layout from '@/layout/index.vue'
import store from '@/store'

Vue.use(VueRouter)

// 路由配置规则
const routes: Array<RouteConfig> = [
  {
    path: '/login',
    name: 'login',
    component: () => import(/* webpackChunkName: 'login' */ '@/views/login/index.vue')
  },
  {
    path: '/',
    component: Layout,
    meta: {
      requiresAuth: true
    },
    children: [
      // {
      //   path: '', // 默认子路由
      //   name: 'home',
      //   component: () => import(/* webpackChunkName: 'home' */ '@/views/home/index.vue')
      // },
      {
        path: '/role',
        name: 'role',
        component: () => import(/* webpackChunkName: 'role' */ '@/views/role/index.vue')
      },
      {
        path: '/menu',
        name: 'menu',
        component: () => import(/* webpackChunkName: 'menu' */ '@/views/menu/index.vue')
      },
      {
        path: '/menu/create',
        name: 'menu-create',
        component: () => import(/* webpackChunkName: 'menu-create' */ '@/views/menu/create.vue')
      },
      {
        path: '/menu/edite/:id',
        name: 'menu-edite',
        component: () => import(/* webpackChunkName: 'menu-edite' */ '@/views/menu/edite.vue')
      },
      {
        path: '/resource',
        name: 'resource',
        component: () => import(/* webpackChunkName: 'resource' */ '@/views/resource/index.vue')
      },
      {
        path: '/resourceCategory',
        name: 'resourceCategory',
        component: () => import(/* webpackChunkName: 'resourceCategory' */ '@/views/resource/resourceCategory.vue')
      },
      {
        path: '',
        name: 'course',
        component: () => import(/* webpackChunkName: 'course' */ '@/views/course/index.vue')
      },
      {
        path: '/courses/new',
        name: 'coursesNew',
        component: () => import(/* webpackChunkName: 'coursesNew' */ '@/views/course/createdOrupdate.vue')
      },
      {
        path: '/courses/:id/sections',
        name: 'coursesSections',
        props: true,
        component: () => import(/* webpackChunkName: 'coursesSections' */ '@/views/course/coursesSections.vue')
      },
      {
        path: '/courses/:id/video',
        name: 'coursesVideo',
        props: true,
        component: () => import(/* webpackChunkName: 'coursesVideo' */ '@/views/course/coursesVideo.vue')
      },
      {
        path: '/user',
        name: 'user',
        component: () => import(/* webpackChunkName: 'user' */ '@/views/user/index.vue')
      },
      {
        path: '/advert',
        name: 'advert',
        component: () => import(/* webpackChunkName: 'advert' */ '@/views/advert/index.vue')
      },
      {
        path: '/advert-space',
        name: 'advert-space',
        component: () => import(/* webpackChunkName: 'advert-space' */ '@/views/advert-space/index.vue')
      }
    ]
  },
  {
    path: '*',
    name: '404',
    component: () => import(/* webpackChunkName: '404' */ '@/views/error-page/404.vue')
  }
]

const router = new VueRouter({
  routes
})

router.beforeEach((to, form, next) => {
  // console.log(to)
  if (!store.state.user && (to.matched).some((item) => item.meta.requiresAuth)) {
    next({
      path: '/login',
      query: {
        redirect: to.fullPath
      }
    })
    return
  }

  next()
})

export default router
